<template>
<div>
   <div class="g_top_box">
		<div class="g_right_box"></div> 
		<div class="g_left_box"><h4>广告信息</h4></div>
	</div>
	<div class="g_content_box">

		<Form :model="info" label-position="left" :label-width="100">

			<FormItem label="名称">
				<Input v-model="info.name" style="width:200px;"></Input>
			</FormItem>
			<FormItem label="详细信息">
				<Input v-model="info.info" type="textarea" style="width:500px;"></Input>
			</FormItem>
			<FormItem label="图片">
				<div class="img_box" style="float:left;" v-show="info.img!=''">
					<img :src="info.img">
				</div>
				<Upload 
					:action="upload_url" 
					:on-success="handleSuccess"
					:format="['jpg','jpeg','png']"
					:max-size="2048"
					:on-format-error="handleFormatError"
					style="display: inline-block;"
				>
					<Button icon="ios-cloud-upload-outline">上传图片</Button>
				</Upload>
			</FormItem>
			
			
			<FormItem>
				<Button type="primary" @click="save">提交</Button>
			</FormItem>
		</Form>
		
	</div>
</div>
</template>

<script>
import Wcore from '@/libs/common';
export default {
    name: 'admin_info',
    data (){
		
        return {
            info:{
				name:'',
				img:'',
				info:''
			},
			id:0,
			upload_url:''
        };
    },
	created(){
		this.upload_url = Whttp.upload_url;
		this.id = this.$route.params.id;
		this.load_data();
		
		this.$emit('change','user');
	},
    computed: {
       
    },
	methods:{
		load_data(){
			var self = this;
			var postdata = {
				id:this.id
			};
			Whttp.load('Other/Ads/get_info',postdata,function(result){
				self.info = result;
			});
		},
		save(){
			var self = this;
			var postdata = {
				id:this.id,
				name:this.info.name,
				info:this.info.info,
				img:this.info.img
			};
			Whttp.load('Other/Ads/save',postdata,function(result){
				self.$Message.info('保存成功');
				self.$router.back();
			});
		},
		handleSuccess (res, file) {
			if(res.result_code==0){
				var url = res.data[0].url;
				this.info.img = url;
			}
		},
		handleFormatError (file) {
			this.$Notice.warning({
				title: 'The file format is incorrect',
				desc: 'File format of ' + file.name + ' is incorrect, please select jpg or png.'
			});
		},
	}
};
</script>
<style scoped>
.img_box{
	display: inline-block;
    width: 60px;
    height: 60px;
    text-align: center;
    line-height: 60px;
    border: 1px solid transparent;
    border-radius: 4px;
    overflow: hidden;
    background: #fff;
    position: relative;
    box-shadow: 0 1px 1px rgba(0,0,0,.2);
    margin-right: 4px;
}
.img_box img{width:100%;height:100%;}
</style>